<!--
 * @Description: 
 * @Author: charles
 * @Date: 2021-05-05 22:02:56
 * @LastEditors: Please set LastEditors
 * @LastEditTime: 2022-01-10 19:21:45
-->
<template>
  <div ref="bottom4_container" style="height: 95%"></div>
</template>

<script>
import { RingProgress } from "@antv/g2plot";

export default {
  data() {
    return {};
  },
  mounted() {
    this.initData();
  },
  methods: {
    initData() {
      const ringProgress = new RingProgress(this.$refs.bottom4_container, {
        height: 200,
        width: 200,
        autoFit: true,
        percent: 0.6,
        color: ["#F4664A", "#E8EDF3"],
        innerRadius: 0.85,
        radius: 0.98,
        statistic: {
          title: {
            style: { color: "#363636", fontSize: "12px", lineHeight: "14px" },
            formatter: () => "进度",
          },
        },
      });

      ringProgress.render();
    },
  },
};
</script>